import React, {Component} from 'react';
import { Menu,Dropdown,Avatar,Badge} from "antd";
import './header.css'
import {clearToken} from "../../utils/auth";
import {
    BrowserRouter as Router,
    Route,
    HashRouter,
    NavLink,
    Switch
} from 'react-router-dom'

export default class Header extends Component {
    constructor(props) {
        super(props);

        this.state = {
            userInfo: {}
        };
    }

    render(props) {
        const popMenu = (
            <Menu
                onClick={p => {
                    if (p.key == "logOut") {
                        clearToken();
                        props.history.push("/login");
                    } else {
                        // message.info(p.key); // tip
                        if ((p.key = "notice")) {
                            props.history.push("/admin/notices");
                        }
                    }
                }}
            >
                <Menu.Item key="notice">通知中心</Menu.Item>
                <Menu.Item key="setting">设置</Menu.Item>
                <Menu.Item key="logOut">退出</Menu.Item>
            </Menu>
        );
        const headerStyle = {
            navBtn: {}

        }
        return (
            <Router>
                <div className="HeaderContain">
                    <header>
                        <div className="logo"/>
                        <Menu theme="dark" mode="horizontal" defaultSelectedKeys={['2']}>
                            <Menu.Item key="2"><NavLink exact to="/Home">主页</NavLink></Menu.Item>
                            <Menu.Item key="3">联系我们</Menu.Item>
                            <Menu.Item key="4">退出</Menu.Item>
                        </Menu>
                        <Dropdown overlay={popMenu}>
                            <div>
                                <Avatar>U</Avatar>
                                <Badge >
                                    <span style={{ color: "#fff" }}>超级管理员</span>
                                </Badge>
                                {/*<Icon type="down" />*/}
                            </div>
                        </Dropdown>
                    </header>
                </div>
            </Router>
        )
    }

}
